<link rel="stylesheet"		type="text/css"		href="JO_CSS/password_strength_meter.css"/>
<script type="text/javascript" src="./JO_JS/password_strength_meter.js"></script>
<script type="text/javascript">

	function validation_onblur(input_name,lbl_validation) {
		if( input_name.value == ""){
			$('#'+lbl_validation).fadeIn("slow", "linear");
			//$('#'+input_name.name).focus();
		}else if ((input_name.name == "txt_account" || input_name.name == "txt_password" || input_name.name == "txt_confirmation") && input_name.value.length < 4) {
			$('#'+lbl_validation).fadeIn("slow", "linear");
			//$('#'+input_name.name).focus();
		}else {
			$('#'+lbl_validation).fadeOut();
		}
	}

	function form_onsubmit(param)
	{
		if (param.txt_account.value=="" || param.txt_account.value.length < 4){
			$('#lbl_account_validation').fadeIn("slow", "linear");
			//$('#lbl_account_validation').text("Bạn phải nhập vào tên tài khoản hơn 4 ký tự");
			param.txt_account.focus();
			return false;
		}

		if (param.txt_password.value=="" && param.txt_password.value.length < 4){
			$('#lbl_password_validation').fadeIn("slow", "linear");
			param.txt_password.focus();
			return false;
		}

		if (param.txt_confirmation.value==""){
			$('#lbl_confirmation_validation').fadeIn("slow", "linear");
			param.txt_confirmation.focus();
			return false;
		}

		if (param.txt_confirmation.value != param.txt_password.value){
			$('#lbl_confirmation_validation').fadeIn("slow", "linear");
			$('#lbl_confirmation_validation').text("Mật khẩu xác nhận không đúng.");
			param.txt_confirmation.focus();
			return false;
		}

		if (param.txt_name.value == ""){
			$('#lbl_name_validation').fadeIn("slow", "linear");
			param.txt_name.focus();
			return false;
		}

		if (param.txt_email.value == ""){
			$('#lbl_email_validation').fadeIn("slow", "linear");
			param.txt_email.focus();
			return false;
		}

		//var temp = $("#txt_email");
	    if (!echeck(param.txt_email.value)) {
		//if (!echeck(param.txt_email.value)) {
			$('#lbl_email_validation').fadeIn("slow", "linear");
			$('#lbl_email_validation').text("Bạn nhập E-mail không đúng định dạng.");
			param.txt_email.focus();
	        return false;
	    }
		
		return true;
	}

	function echeck(d) {
	    return /^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9\-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/.test(d);
	}
	//check email
	//obj: object form to compare
	//error_message_id: message id
	function check_email(obj,lbl_validation) {
	    var temp = $("#" + obj);
	    if (!echeck(temp.val())) {
	    	$('#lbl_email_validation').fadeIn("slow", "linear");
			$('#lbl_email_validation').text("Bạn nhập E-mail không đúng định dạng.");
	        temp.focus();
	        return;
	    }else {
			$('#'+lbl_validation).fadeOut();
		}
	}
</script>

<script type="text/javascript">

	jQuery(document).ready(function() {

		//Remove character "<",">" for textbox when press key
		$('#txt_account').keyup(function() {
			var name_without_space = $("#txt_account").val().replace(/ /g,'');
			//var name_without_special_char = name_without_space.replace(/[^a-zA-Z 0-9]+/g,'');
			var name_without_special_char = name_without_space.replace(/[<>',]+/g,'');
			$(this).attr("value", name_without_special_char );
		});

		$('#txt_account').change(function() {
			var name_without_space = $("#txt_account").val().replace(/ /g,'');
			var name_without_special_char = name_without_space.replace(/[<>',]+/g,'');
			$(this).attr("value", name_without_special_char );
		});
		
		var bpos = "";
		var perc = 0 ;
		var minperc = 0 ;
		$('#txt_password').css( {backgroundPosition: "0 0"} );
		
		$('#txt_password').keyup(function(){
			$('#result').html(passwordStrength($('#txt_password').val(),$('#txt_account').val())) ; 
			perc = passwordStrengthPercent($('#txt_password').val(),$('#txt_account').val());
			
			bpos=" $('#colorbar').css( {backgroundPosition: \"0px -" ;
			bpos = bpos + perc + "px";
			bpos = bpos + "\" } );";
			bpos=bpos +" $('#colorbar').css( {width: \"" ;
			bpos = bpos + (perc * 2) + "px";
			bpos = bpos + "\" } );";
			eval(bpos);
		    	$('#percent').html(" " + perc  + "% ");
			});
	});
</script>

<div style="width: 960px;background: url(JO_images/hr.gif1) repeat-x top left #222;position: relative;float:left;">

<div style="margin-left: 0px;" class="bar_240i" >
	<div style="" class="JO_h1i">
		Tôi muốn ...
	</div>
	<div class="content240i">
		<ul class="navi" style="">
		
			<li>
				<a 
					href="?JO_unit=012_register&SO_page=find"
					<?php if(isset($_GET["JO_unit"])&& $_GET["JO_unit"]=="012_register")
						echo "class=\"item_selected\"";
					?>
				>Find My Account</a>
                <a 
					href="?JO_unit=012_register"
					<?php if(isset($_GET["JO_unit"])&& $_GET["JO_unit"]=="012_register") 
						echo "class=\"item_selected\"";
					?>
				>Register
</a>
			</li>
		</ul>
	</div>
</div>
<!-- end nav kpopzone-->
<div class="mar8i"></div>
<?php 
$JO["id"]= JO( array( "EN" => "Your ID","VI"=>"ID Của Bạn") );
$JO["email"]= JO( array( "EN" => "Your Mail","VI"=>"Email Của Bạn") );
$JO["secret_question"]= JO( array( "EN" => "Secret Question","VI"=>"Câu Hỏi Bí mật") );
$JO["secret_answer"]= JO( array( "EN" => "secret_answer","VI"=>"Câu Trả Lời") );
$JO["Submit"]= JO( array( "EN" => "Submit","VI"=>"Đồng Ý") );
$patd ="C:/xampp/htdocs/00_JO/JOi/";
 
$page=isset($_GET['SO_page'])?$_GET['SO_page']:'';
	if($page==''){
?>
<div style="margin-left: 0px;" class="bar_720i" >
	
	<div style="" class="JO_h1i">
		Đăng Ký
		
	</div>
	
	<div class="content720i">
		<div class="mar8i"></div>
		
		<div style="width: 704px;float: left;margin-bottom: 8px;">
			<div class="JO_Kpop_itemi JO_no_background">			
				<div class="mar8i"></div>
				
				<form 
					action		= "controller/JO_navigation.php"
					target		= "JO_integration_asynchronous"
					method		= "post"
					onsubmit	= "return form_onsubmit(this);"
				>
					<input type="hidden"				name="JO_controller"		value="index_controller"										/>
					<input type="hidden" id="JO_query"	name="JO_query"				value="account_signin"											/>
					<input type="hidden"				name="JO_account_return"	value="<?= urldecode(isset($_REQUEST[ "JO_account_return" ])?$_REQUEST[ "JO_account_return" ]:"" ) ?>"	/>
					
                                        <table class="tbi" style="margin: 4px 0;width: 688px">
					<!-- Identifier -->
						<tr>
							<th style="width: 160px;">Tài Khoản:*</th>
							<td
							><input
								type		= "text"
								id			= "txt_account"
								name		= "txt_account"
								value		= "<?= isset($record[ "identifier"	])?$record[ "identifier"	]:""?>"
								class		= "input_texti"
								onblur		= "validation_onblur(this,'lbl_account_validation');"
                                                                style="width:516px"
							/>
							<label
								id		= "lbl_account_validation"
								class	= "JO_lbl_validation"
							>Bạn phải nhập vào tên tài khoản hơn 4 ký tự.</label>
							</td>
						</tr>
					<!-- Password -->
						<tr>
							<th style="vertical-align: top;">Mật Khẩu:*</th>
							<td class="pass_strength">
								<input
									type		= "password"
									id			= "txt_password"
									name		= "txt_password"
									value		= "<?= isset($record[ "password" ])?$record[ "password" ]:""?>"
									maxlength	= "16"
									class		= "input_texti"
									style		= "width:516px"

								/>
								<div class="graybar" id="graybar"></div>
								<div class="colorbar" id="colorbar"></div>
								<span class="percent" id="percent">0%</span>
								<span class="result" id='result'></span>
							</td>
						</tr>
                                                <tr>
                                                    <th>Xác Nhận Mật Khẩu:*</th>
                                                    <td>
                                                                <input
									type		= "password"
									id			= "txt_confirmation"
									name		= "txt_confirmation"
									value		= "<?= isset($record[ "password" ])?($record[ "password" ]):""?>"
									maxlength	= "16"
									class		= "input_texti"
									onblur		= "validation_onblur(this,'lbl_confirmation_validation');"
                                                                        style		= "width:516px"
								/>
								<label
									id		= "lbl_confirmation_validation"
									class	= "JO_lbl_validation"
								>Bạn phải nhập xác nhận mật khẩu.</label>
                                                    </td>
                                                </tr>
					<!-- Name -->
						<tr>
							<th>Họ và Tên:*</th>
							<td>
								<input
									type	= "text"
									id		= "txt_name"
									name	= "txt_name"
									value	= "<?= isset($record[ "name" ])?$record[ "name" ]:""?>"
									class	= "input_texti"
									onblur	= "validation_onblur(this,'lbl_name_validation');"
                                                                        style		= "width:516px"
								/>
								<label
									id		= "lbl_name_validation"
									class	= "JO_lbl_validation"
								>Bạn phải nhập họ và tên.</label>
							</td>
						</tr>
					<!-- Mail -->
						<? $temp = explode( "\r\n", isset($record[ "mail" ])?$record[ "mail" ]:"" ); ?>
						<tr>
							<th>E-mail:*</th>
							<td>
								<input
									type	= "text"
									id		= "txt_email"
									name	= "txt_email"
									value	= "<?= $temp[ 0 ] ?>"
									class	= "input_texti"
									onblur	= "check_email('txt_email','lbl_email_validation');"
                                                                        style		= "width:516px"
								/>
								<label
									id		= "lbl_email_validation"
									class	= "JO_lbl_validation"
								>Bạn phải nhập địa chỉ mail.</label>
							</td>
						</tr>
					<!-- Sex -->
						<tr>
							<th>Giới Tính:</th>
                                                        <td><select name="cb_sex" id = "cb_sex" 
                                                                    class="input_selecti"
                                                                    style="width: 136px;"
                                                                    >
								<option></option>
								<option value="male"	<?=(isset($record[ "sex" ])?$record[ "sex" ]:"") == "male"		? "selected" : "" ?>>Nam</option>
								<option value="female"	<?= (isset($record[ "sex" ])?$record[ "sex" ]:"") == "female"	? "selected" : "" ?>>Nữ</option>
							</select></td>
						</tr>
					<!-- Phone -->
						<? $temp = explode( "\r\n", isset($record[ "phone" ])?$record[ "phone" ]:"" ); ?>
						<tr>
							<th>Điện Thoại:</th>
							<td><input
								type	= "text"
								name	= "txt_phone"
								value	= "<?= $temp[ 0 ] ?>"
								class	= "input_texti"
                                                                style		= "width:516px"
							/></td>
						</tr>
					<!-- Address -->
						<? $temp = explode( "\r\n", isset($record[ "address" ])?$record[ "address" ]:"" ); ?>
						<tr>
							<th>Địa Chỉ</th>
							<td>
								<input
									type	= "text"
									name	= "txt_address"
									value	= "<?= $temp[ 0 ] ?>"
									class	= "input_texti"
                                                                        style		= "width:516px"
								/>
							</td>
						</tr>
					<!-- Birth -->
						<tr>
							<th>Ngày Sinh:</th>
							<td>
								<select name="cb_birth_day"
                                                                        class="input_selecti"
                                                                        style="width: 60px;margin-right: 4px"
                                                                        >
									<option><?= substr( isset($record[ "birth" ])?$record[ "birth" ]:"", 8, 2 ) ?></option>
									<? for( $i = 1; $i <= 31; $i ++ ) { ?><option><?= sprintf( "%02d", $i ) ?></option><? } ?>
								</select>
                                                                
								<select name="cb_birth_month"
                                                                        class="input_selecti"
                                                                        style="width: 60px;margin-right: 4px"
                                                                        >
									<option><?= substr( isset($record[ "birth" ])?$record[ "birth" ]:"", 5, 2 ) ?></option>
									<? for( $i = 1; $i <= 12; $i ++ ) { ?><option><?= sprintf( "%02d", $i ) ?></option><? } ?>
								</select>
                                                                
								<select name="cb_birth_year"
                                                                        class="input_selecti"
                                                                        style="width: 80px;"
                                                                        >
									<option><?= substr( isset($record[ "birth" ])?$record[ "birth" ]:"", 0, 4 ) ?></option>
									<? for( $i = intval( date( 'Y' ) ); $i > intval( date( 'Y' ) ) - 70; $i -- ) { ?><option><?= $i ?></option><? } ?>
								</select>
							</td>
						</tr>
					<!-- Submit -->
						<tr>
							<th></th>
							<td
							><input
								type	= "submit"
								value	= "Đăng Ký"
								class	= "input_buttoni"
								onclick	= "document.getElementById( 'JO_account_query' ).value = '<?= empty( $_SESSION[ "JO_account_key" ] ) ? "insert" : "update" ?>'; submit( );"
							/></td>
						</tr>
					</table>
					
				</form>
			</div>
		</div>
		
	</div>
	
</div>
<?php }if($page=="find"){?>

<div style="margin-left: 0px;" class="bar_720i" >
	<div style="" class="JO_h1i">
		Quên Mật Khẩu
	</div>
    <div class="content720i">
		<div class="mar8i"></div>
			<div style="width: 704px;float: left;margin-bottom: 8px;">
				<div class="JO_Kpop_itemi JO_no_background">			
					<div class="mar8i"></div>
                  <form action="controller/JO_navigation.php" method="post">
                 <table class="tbi" style="margin: 4px 0;width: 688px">
					<!-- Identifier -->
                            <tr>
                                <th style="width: 160px;"><?=$JO["id"]?> </th>
                                <td><input type="text" name="username" id='username'class="input_texti" style="width:400px" />
                                <span id="error" style="color:#F00">
									  <?php
										  if(isset($_SESSION['msg3'])){
												  echo $_SESSION['msg3'];
												  $_SESSION['msg3']="";}
                                          ?>
                                  </span>
                                </td>
                            </tr>
                            <tr>
                                <th style="width: 160px;"><?=$JO["secret_question"]?></th>
                                <td>
                                <select name="secret_question" id="secret_question" class="input_selecti" style="width:416px;text-align:center">
                                        <option value="">---Mời Chọn Câu Hỏi---</option>
                                        <option value="1"> Tên Trường Tiểu Học Của Bạn   </option>
                                        <option value="2"> Tủ Áo Của Bạn Có Bao Nhiu Cái </option>
                                        <option value="3"> Quyển Sách Bạn Đọc Nhiều Nhất </option>
                                        <option value="4"> Game Bạn Thích Chơi Nhất      </option>
                                        <option value="5"> Bộ Phim Bạn Thích Nhất        </option>
                                  </select>
                                </td>
                            </tr>
                             <tr>
                                <th style="width: 160px;"><?=$JO["secret_answer"]?></th>
                                <td>
                                <input type="password" name="secret_answer" id="secret_answer" class="input_texti" style="width:400px" onblur="show();"/>
                                <span id="error4" style="color:#F00">
   								<?php if(isset($_SESSION['msg2'])){
                                      echo $_SESSION['msg2'];
                                      $_SESSION['msg2']="";}
                                            
                                ?>
                                </td>
                            </tr>
                             <tr>
                                <th style="width: 160px;"></th>
                                <td>
                                 <input type="hidden" id="JO_controller" name="JO_controller" value="JO_Find_Pass_Controller" />
                                 <input type="submit" class="input_texti"  value="<?=$JO["Submit"]?>"style="width:416px"/>
                               
                                </td>
                            </tr>
                  </table>
                  </form>
                  <div id="loadImport" style="color:#0F0;text-align:center;padding:8px"> 
						 <?php if(isset($_SESSION['msg4'])){
                                  echo $_SESSION['msg4'];
                                  $_SESSION['msg4']="";}?>
     			 </div>
           		 </div>
        	</div>
		</div>
	</div>
<?php }?>